<template>
  <div class="container">
      <div class="content">
        <a-card class="box-card" shadow="hover">
            <a-form ref="form" :model="form" :rules="rules">
				<a-form-item style="text-align:center">
                    <div style="font-size:22px;font-weight:700">
						渝眼后台管理系统
					</div>
                </a-form-item>
                <a-form-item prop="tel">
                    <a-input prefix-icon="a-icon-user" v-model.trim="form.tel" placeholder="账号"></a-input>
                </a-form-item>
				<a-form-item prop="pwd">
                    <a-input prefix-icon="a-icon-unlock" v-model.trim="form.pwd" placeholder="密码"></a-input>
                </a-form-item>
				
				<a-form-item>
                    <a-button type="primary" style="width:100%" @click="onsubmit">登录</a-button>
                </a-form-item>
			</a-form>
        </a-card>
      </div>
  </div>
</template>

<script>
export default {
	data(){
		return {
			form:{
				tel:'',
				pwd:''
			},
			rules:{
				tel:[ { required: true, message: '请输入账号', trigger: 'blur' },],
				pwd:[ { required: true, message: '请输入密码', trigger: 'blur' },]
			}

		}
	},
	mounted(){
	},
	methods:{
		onsubmit(){
			if (!this.form.tel||!this.form.pwd){
				return this.$message.warning('用户名和密码不能为空！')
			}
            
            if ( this.form.tel=='admin' && this.for.pwd=='admin' ) {
                this.$message.success('登录成功')
                sessionStorage.setItem('token','123')
                setTimeout(()=>{
                    this.$router.push("/index")
                },1000)
            } else {
                this.$message.error('密码错误');
            }
			// let api ='/vue/login'
			// this.axios.get(api,{params:{
			// 	username:this.form.tel,
			// 	password:this.form.pwd
			// }}).then(res=>{
				
			// 	if(res.data.msg==="登录成功"){
			// 		this.$message.success('登录成功');
			// 		sessionStorage.setItem('token',res.data.token);
			// 		localStorage.setItem('username',this.form.tel);
			// 		localStorage.setItem('password',this.form.pwd);
			// 		setTimeout(()=>{
			// 			this.$router.push("/index")
			// 		},1000)
			// 	}else{
			// 		this.form.pwd=""
			// 		this.$message.error('密码错误');
			// 	}
			// }).catch(res=>{
			// 	console.log(res)
			// })
			
				
				
			
		}
	}
}
</script>

<style lang="scss">
.container{
	
    width: 100vw;
    height: 100vh;
    background: linear-gradient(to bottom,#409eff,#fff);
    animation: change 0.5 0.5s forwards;
    display: flex;
    justify-content: center;
    align-items: center;
    .content{
        width: 500px;
        // height: 300px;
        background-color: #fff;
				border-radius: 15px;
    }
}
@keyframes change {
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

</style>